<template>
  <div class="record-report">
    <GetForm @getlist="getform" />
    <div class="bodybox">
      <TopTitle @command="command" @daochu="daochu" @shuaxin="getlist" />
      <div class="table">
        <TableColumn
          :issize="iissize"
          ref="tabledataref"
          :tableData="tableData"
          :tableConfig="tableConfig"
        >
          <el-table-column label="操作" width="320">
            <template #default="{ row }">
              <div>
                <el-popconfirm title="确认生成吗？" @confirm="toput(row)">
                  <el-link type="primary" slot="reference" :underline="false" class="link">生成</el-link>
                </el-popconfirm>
                <el-link type="primary" :underline="false" @click="$refs.getPowerrefs.tosplit(row)" class="link">电量分摊</el-link>
                <el-link type="primary" :underline="false" @click="$refs.getRatiorefs.tosplit(row)" class="link">比例分摊</el-link>
                <el-link type="primary" v-if="row.generateFlag" :underline="false" @click="exportpdf(row)" class="link">导出pdf</el-link>
                <el-link type="primary" v-if="row.generateFlag" :underline="false" @click="exportexcels(row)" >导出excel</el-link>
              </div>
            </template>
          </el-table-column>
        </TableColumn>
        <getRatio ref="getRatiorefs" />
        <getPower ref="getPowerrefs" />
      </div>
      <div class="fenye">
        <el-pagination
            background
            layout="prev, pager, next"
            :current-page.sync="pageNo"
            @current-change="getlist"
            :page-size="15"
            :total="total"
          >
        </el-pagination>
      </div>
    </div>
  </div>
</template>
<script>
import getRatio from '../component/getRatio.vue'
import getPower from '../component/getPower.vue'
import TopTooltip from '@/components/TopTitle/newtitle.vue'
import TableColumn from '@/components/Table/index.vue'
import { exportexcel } from '@/utils/excel'
import {ExportPdf} from '@/utils/exportpdf'
import GetForm from '../component/getForm.vue'
import {getApportionapi,postgenerateapi} from '@/api/energy-consumption/demand/record-report'
export default {
  name: 'CallPoliceIndex',
  components: {
    GetForm,
    getPower,
    getRatio,
    TopTooltip,
    TableColumn
  },
  data() {
    return {
      total: 0,
      pageNo: 0,
      pageSize: 15,
      formdata:{},
      iissize: 'medium',
      tableData: [],
      tableConfig: [
        { label: '序号', type: 'index', width: '100', center: 'center' },
        { label: '企业名称', prop: 'companyName' },
        { label: '年度', prop: 'year' },
        { label: '月份', prop: 'month' },
        { label: '期', prop: 'periodValue' },
        { label: '电量(kWh)', prop: 'actualPower' },
        { label: '电费(元)', prop: 'withoutTaxActualCost' },
        { label: '是否生成', prop: 'generateFlag',
          formatter: (row, column, cellValue, index) => {
            return cellValue?'是':'否'
          }
         },
        { label: '生成日期', prop: 'apportionCreateDate' },
      ]
    }
  },

  mounted() {},

  methods: {
    async getlist(){
      this.$refs.tabledataref.loading=true
      const pageNo=this.pageNo-1
      const {data:{list,totalCount}}=await getApportionapi({...this.formdata,pageSize:this.pageSize,pageNo})
      this.total=totalCount
      this.tableData=list
      this.$refs.tabledataref.loading=false
    },
    getform(val) {
      this.formdata={...val}
      this.getlist()
    },
    toput(row) {
      postgenerateapi(row.id).then(res=>{
        this.$message({
          type: res.code == '200' ? 'success' : 'warning',
          message:res.code=='200'?'生成成功':res.message
        })
        this.getlist()
      })
    },
    //导出pdf
    exportpdf(val){
      ExportPdf(
        '/ecm-microservice-biz/ecm/annual/apportion/report/exportPdf',{id:val.id},'分摊表'
      )
    },
    // 导出excel
    exportexcels(val){
      exportexcel(
        '/ecm-microservice-biz/ecm/annual/apportion/report/exportExcel',{id:val.id},'分摊表'
      )
    },
    // 导出
    daochu() {
      exportexcel(
        '/ecm-microservice-biz/ecm/annual/apportion/exportExcel',
        this.formdata,
        '分摊记录'
      )
    },
    // 表格密度调节
    command(val) {
      this.iissize = val
    }
  }
}
</script>
<style lang="scss" scoped>
.record-report {
  height: 100%;
  padding: 10px;
  .bodybox{
    height: calc(100% - 90px);
    background-color: #fff;
    padding: 20px;
    .table{
      height: 88%;
      .link{
        margin-right: 10px;
      }
    }
    .fenye{
      margin-top: 10px;
      text-align: right;
    }
  }
}
</style>
